<template>
  <Dialogdrawerdefect :ddtvisible="dialogVisible" size="505px" :has-modal="false" :modal="false" @close="handleClose" :title="`操作记录详情【${ruleForm.operatorDate}】`">
    <div class="col-right" v-loading="loading">
      <el-form inline class="rule-form" ref="form" :model="ruleForm">
        <el-form-item label="医院名称:" prop="hospitalName" class="short-input">
          <el-input v-model="ruleForm.hospitalName" readonly></el-input>
        </el-form-item>
        <el-form-item :label="v.name+':'" class="short-input" v-for="(v,index) in ruleForm.appointmentListDmbContents" :key="index">
          <el-input :value="v.value" readonly></el-input>
        </el-form-item>
        <el-form-item label="表名:" prop="tabelName" class="short-input">
          <el-input v-model="ruleForm.tabelName" readonly></el-input>
        </el-form-item>
        <el-form-item label="表Id:" prop="tabelId" class="short-input">
          <el-input v-model="ruleForm.tabelId" readonly></el-input>
        </el-form-item>
        <el-form-item label="操作方法:" prop="operatorStatus" class="short-input">
          <el-input v-model="ruleForm.operatorStatus" readonly></el-input>
        </el-form-item>
        <el-form-item label="操作来源:" prop="operatorId" class="short-input">
          <el-input v-model="ruleForm.operatorId" readonly></el-input>
        </el-form-item>
        <el-form-item label="IP地址:" prop="ipAddress" class="short-input">
          <el-input v-model="ruleForm.ipAddress" readonly></el-input>
        </el-form-item>
        <el-form-item label="限制参数">
          <el-table :data="ruleForm.appointmentFilters">
            <el-table-column
              prop="parametersName"
              label="参数说明"
              width="140">
            </el-table-column>
            <el-table-column
              prop="parametersType"
              label="参数类型"
              width="140">
            </el-table-column>
            <el-table-column
              prop="parametersValues"
              label="参数值"
              width="140"
            >
            </el-table-column>
          </el-table>
        </el-form-item>
        <el-form-item label="模块名称:" prop="moduleName" class="long-input">
          <el-input v-model="ruleForm.moduleName" readonly></el-input>
        </el-form-item>
        <el-form-item label="sql语句:" prop="sql" class="long-input">
          <el-input v-model="ruleForm.sql" type="textarea" readonly></el-input>
        </el-form-item>
        <el-form-item label="备注:" prop="remark2" class="long-input">
          <el-input v-model="ruleForm.remark2" type="textarea" readonly></el-input>
        </el-form-item>
      </el-form>
      <div class="buttons">
        <div class="right-buttons">
          <el-button size="small" @click="handleClose">关 闭</el-button>
        </div>
      </div>
    </div>
  </Dialogdrawerdefect>
</template>
<script>
import Dialogdrawerdefect from '@/components/dialogbox/dialogDrawerDefect'
import { setuplogGetmodel } from '@/api/api.js'
export default {
  name: 'EditDialog',
  components: {
    Dialogdrawerdefect
  },
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    id: {
      String,
      default: ''
    },
    hospitalCode: {
      String,
      default: ''
    }

  },
  data() {
    return {
      ruleForm: {},
      allContentArr: [],
      allContentTable: [],
      loading: false
    }
  },
  watch: {
    id(val) {
      if (val) {
        this.getDetail(val)
      }
    }
  },
  methods: {
    handleClose() {
      this.$emit('myClose')
    },
    async getDetail(id) {
      await this.$getHospitalList()
      this.loading = true
      setuplogGetmodel({ id: id, hospitalCode: this.hospitalCode }).then(res => {
        this.loading = false
        if (res && res.code === 10000) {
          this.ruleForm = res.content
          let obj = this.mx_hospitalList.find(v => {
            return v.code === this.ruleForm.hospitalCode
          })
          if (obj) {
            this.ruleForm.hospitalName = obj.name
          }
        }
      }).catch(() => {
        this.loading = false
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.col-right{
        border-left: 1px solid #e5e5e5;
        padding: 0px 20px 47px;
        color: #606266;
        background-color: #FFFFFF;
        .short-input{
            width: 200px;
            margin-right: 23px!important;
            margin-bottom: 5px;
            .el-input{
                width: 200px;
            }
        }
        .mini-input{
            width: 185px;
            margin-right: 15px !important;
            margin-bottom: 5px;
            .el-input{
                width: 185px;
            }
        }
        .large-width{
            width: 424px;
            /deep/ .el-textarea__inner{
                width: 424px;
            }
        }
        .long-input{
            width: 100%;
            margin-right: 19px!important;
            margin-bottom: 3px;
            /deep/ .el-textarea__inner,.el-input{
                width: 425px;
            }
        }
        .describe-input{
            width: 350px;
            .el-input{
                width: 350px;
            }
        }
        .name{
            font-weight: bold;
        }
        .el-form--inline .el-form-item{
            margin-right:0px
        }
        .buttons{
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            background: #fff;
            padding: 5px 25px;
            border-top: 1px solid #E5E7EC;
            line-height: 31px;
            /deep/ .el-form-item__content{
                width:100%
            }
            .right-buttons{
                float:right
            }
            .el-dropdown{
                color: #00c0ef;
            }
        }
        .text-block{
            background: #f5f5f5;
            padding: 0 10px;
            margin-top: 10px;
        }
        .content-block{
           padding: 0 10px;
        }
    }
</style>
